<template>
  <div class="earn-integral" v-if="integral.grant_point">
    <i class="earn-integral__icon"></i>
    <span class="earn-integral__desc">{{t('payState_congratulations')}}{{ integral.grant_point }}{{t('payState_points')}}</span>
  </div>
</template>

<script>
import * as api from './api';
import locale from '../../../../mixins/locale'

export default {
  name: 'earnIntegral',
  props: {
    orderId: {
      type: String,
      default: '',
    },
    isAlive: {
      default:0,
      type:Number
    },
  },
  mixins: [locale],
  data() {
    return {
      integral: {
        grant_point: 0,
      },
    };
  },
   created() {
     this.loadIntegralData();
     if(this.isAlive === 1){
       api.changealivePrefix('/_alive')
    }else{
       api.changealivePrefix('')
    }
  },
  methods: {
    // 获取消费成功获得的积分
    loadIntegralData() {
      api
        .getIntegralData({ order_id: this.orderId })
        .then((res) => {
          if (res.code === 0) {
            this.integral = res.data;
          }
        })
        .catch((err) => {
          console.error(err);
        });
    },
  },
};
</script>

<style lang="scss" scoped>
.earn-integral {
  width: 100%;
  height: 0.36rem;
  margin: 0.32rem auto;
  display: flex;
  justify-content: center;
  align-items: center;

  &__icon {
    display: inline-block;
    width: 0.32rem;
    height: 0.32rem;
    margin-right: 0.08rem;
    background-image: url('//wechatapppro-1252524126.file.myqcloud.com/appAKLWLitn7978/image/b_u_5b2225aa46488_oGKN7IvA/kn012mx10rjc.png');
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
  }

  &__desc {
    font-size: 0.24rem;
    line-height: 0.36rem;
    color: #ff781f;
  }
}
</style>
